<template>
  <DFModalKeyboard
    v-if="!props.chooseItem || Number(props.chooseItem?.orderStatusCode) !== 30"
    class="searchpro"
    v-model:value="proSearch"
    :input-type="'number'"
    :clearable="true"
    :placeholder="
      $t('productionCenter.table.searchProTip')
    "
    :precision="0"
    @clear="getProSearchFn"
    @keyup.enter="getProSearchFn"
    @ok-fn="getProSearchFn"
  >
    <template #prefix>
      <n-icon :component="SearchOutline" />
    </template>
  </DFModalKeyboard>
</template>

<script lang="ts" setup>
  import { SearchOutline } from '@vicons/ionicons5';
  import DFModalKeyboard from '@/components/DFModalKeyboard/index.vue'

  type Props = {
    chooseItem:any
  }

  const props = withDefaults(defineProps<Props>(), {
    chooseItem:()=> null
  });

  const emit = defineEmits([
    'setProSearchValFn'
  ]);

  const proSearch = ref('');

  const getProSearchFn = () => {
    emit('setProSearchValFn',proSearch.value)
  }
</script>

<style lang="less" scoped>
.searchpro {
  :deep(.n-input__input-el) {
    height: 48px;
    line-height: 48px;
  }
}
</style>
